<template>
	<view class="ferry">
		<!-- 联系人信息 -->
		<view class="ferry_addr" @click="goNext('/pages/my/addressList?mode=choose')">
			<view class="flex-column-center" v-if="addressobj.id" style="align-items: flex-start;">
				<view class="w100 font13 flex-row-between">
					<view>
						<text>{{addressobj.name}}</text>
						<text style="margin-left: 10rpx;">{{addressobj.mobile}}</text>
					</view>
					<uni-icons class="fr" type="arrowright" size="12" color="#9a9a9a"></uni-icons>
				</view>
				<view class="font14 font-666666" style="margin-top: 10rpx;">
					{{addressobj.province}}{{addressobj.city}}{{addressobj.area}}{{addressobj.address}}
				</view>
			</view>
			<view v-else class="addr_no font-1e1e1e font14">暂无收货地址,点击添加地址</view>
		</view>
		<view class="ferry-border"></view>
		<!-- 商品 -->
		<view class="ferry-shop">
			<image :src="imgPath+dataobj.goods_info.images" mode=""></image>
			<view class="shop-bos flex-column-between">
				<view class="ellipsis font14 font-1e1e1e">{{dataobj.goods_info.name}}</view>
				<view class="flex-row-between font-969696 font13">
					<view>规格 默认</view>
					<view>x{{dataobj.goods_number}}</view>
				</view>
				<view class="font14 font-ff6428">
					<text>{{dataobj.goods_info.score}}</text>
					<text>积分</text>
					<text v-if="dataobj.goods_info.price">
						<text>+</text>
						<text>￥{{dataobj.goods_info.price}}</text>
					</text>
				</view>
			</view>
		</view>
		<view class="ferry-info">
			<view class="flex-row-between font13">
				<view class="font-1e1e1e">运费</view>
				<view class="font-1e1e1e">￥0.00</view>
			</view>
			<view class="flex-row-between font13" style="margin: 46rpx 0;">
				<view class="font-1e1e1e">共计</view>
				<view class="font-ff6428">{{dataobj.all_score}}积分+￥{{dataobj.price}}</view>
			</view>
			<view class="flex-row-between font13">
				<view class="font-1e1e1e">消费积分</view>
				<view class="font-ff6428">-{{dataobj.all_score}}积分</view>
			</view>
		</view>
		<view class="ferry-border"></view>
		<view class="ferry-leave" v-if="dataobj.pay_account != 3">
			<view class="font13 font-1e1e1e">充值账号</view>
			<textarea class="ferry-textarea font13" :value="account" @input="Oninfo"
				placeholder-class="placeholderClass" :placeholder="placeholder" />
		</view>
		<view class="info-bnt flex-row-between">
			<view>
				<view>
					<text class="font12">订单金额:</text>
					<text class="font-ff6428 font16">￥{{dataobj.price}}</text>
				</view>
				<view class="font-ff6428 font11" style="margin-top: 10rpx;">{{dataobj.all_score}}积分</view>
			</view>
			<view class="bnt" @click="onPay">立即兑换</view>
			<!-- <view class="bnt" @click="goNext('/pages/integral/success')">立即兑换</view> -->
		</view>
		<view class="info-bnt1"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: null,
				dataobj: {},
				addressobj: {
					id: null
				}, //地址
				account: '',
				imgPath: this.$Config.http_static, // 图片头
				openid:'',
				placeholder:''
			}
		},
		onUnload: function() {
			// 关闭监听选择收货地址事件
			uni.$off('chooseAddr')
		},
		onLoad(options) {
			this.id = options.id
			this.getInfo()
			// 开启监听选择收货地址事件，如果有值就关闭默认地址
			uni.$on('chooseAddr', (res) => {
				this.addressobj = res
			})
			this.openid = uni.getStorageSync("openid");
			this.getAddress()
		},
		methods: {
			getInfo() {
				this.$Http({
					url: 'getOrderInfo',
					token: true,
					data: {
						id: this.id
					}
				}).then(res => {
					if (res.code == 1) {
						res.data.all_score = this.$base.numAdd(res.data.score, res.data.crs_score)
						if(res.data.pay_account == 1){
							this.placeholder = '请输入手机号'
						}else{
							this.placeholder = '请输入QQ号'
						}
						this.dataobj = res.data
					}
				});
			},
			// 地址列表
			getAddress() {
				this.$Http({
					url: 'address',
					token: true,
				}).then(res => {
					if (res.code == 1) {
						if (res.data.data.length > 0) {
							this.addressobj = res.data.data[0]
							res.data.data.forEach(item => {
								if (item.status == 'normal') {
									this.addressobj = item
								}
							})
						} else {
							this.addressobj = {}
						}
					}
				});
			},
			Oninfo(e) {
				let val = e.detail.value
				this.account = val
			},
			onPay() {
				var that = this
				if(this.dataobj.pay_account != 3){
					if (!this.account) {
						uni.showToast({
							icon: 'none',
							duration: 2000,
							title: '请输入充值账号'
						});
						return
					}
				}
				if (!this.addressobj.id) {
					uni.showToast({
						icon: 'none',
						duration: 2000,
						title: '请选择地址'
					});
					return
				}
				let data = {
					account: this.account,
					order_id: this.id,
					address_id: this.addressobj.id
				}
				// #ifdef H5
				data.openid = that.openid
				data.source = 1
				that.payOrder(data)
				// #endif
				// #ifdef MP-WEIXIN
				wx.login({
					success: res => {
						data.code = res.code
						that.payOrder(data)
					}
				})
				data.source = 2
				// #endif

			},
			payOrder(data){
				this.$Http({
					url: 'scorepayOrder',
					token: true,
					load: true,
					type: 'POST',
					data: data
				}).then(res => {
					if (res.code == 1) {
						if(res.data == 0){
							uni.redirectTo({ url: '/pages/integral/success?id='+this.id })
						}else{
							this.Onpay(res.data)
						}
					} else {
						uni.showToast({
							icon: 'none',
							duration: 2000,
							title: res.msg
						});
					}
				});
			},
			// 支付
			Onpay(param) {
				var that = this
				// #ifdef MP-WEIXIN
				uni.requestPayment({
					provider: 'wxpay',
					timeStamp: param.timeStamp,
					nonceStr: param.nonceStr,
					package: param.pacKage,
					signType: 'MD5',
					paySign: param.paySign,
					success: function(res) {
						uni.showToast({
							title: '支付成功'
						});
						// uni.removeStorageSync("idInfo_origin");
						setTimeout(()=>{
							uni.redirectTo({ url: '/pages/integral/success?id='+that.id })
						}, 2000)
					},
					fail: function(err) {
						console.log(err, '789')
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						});
						// setTimeout(() => {
						// 	uni.switchTab({ url: '/pages/my/index' })
						// }, 2000)
					}
				});
				// #endif
				// #ifdef H5
				if (that.wxSdk) {
					this.$wxapi.OnWXPay(param).then(res => {
						console.log('OnWXPay返回：' + JSON.stringify(res))
						if (res.code == 1) {
							uni.showToast({
								title: '支付成功'
							});
						} else if (res.code == 0) {
							uni.showToast({
								title: '支付失败',
								icon: 'none'
							});
						} else if (res.code == 3) {
							uni.showToast({
								title: '支付取消',
								icon: 'none'
							});
						}
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/my/index'
							})
						}, 2000)
					})
				} else {
					uni.showToast({
						title: '微信签名失败',
						icon: 'none'
					});
				}
				// #endif
			},
			//跳转
			goNext(url) {
				this.$Router.push(url)
			}
		}
	}
</script>

<style lang="less">
	.ferry {
		.ferry_addr {
			width: 750rpx;
			padding: 20rpx 35rpx;

			.addr_no {
				text-align: center;
			}
		}

		.ferry-border {
			width: 750rpx;
			height: 15rpx;
			background-color: #f5f5f5;
		}

		.ferry-shop {
			display: flex;
			padding: 32rpx 35rpx;
			border-bottom: solid 1rpx #f5f5f5;
			width: 750rpx;

			image {
				width: 160rpx;
				height: 160rpx;
				background-color: #ffffff;
				border-radius: 10rpx;
			}

			.shop-bos {
				width: 520rpx;
				height: 160rpx;
				padding-left: 20rpx;
			}
		}

		.ferry-info {
			padding: 32rpx 35rpx;
		}

		.ferry-leave {
			padding: 20rpx 35rpx;

			.ferry-textarea {
				width: 680rpx;
				height: 180rpx;
				background-color: #f5f5f5;
				border-radius: 10rpx;
				margin-top: 26rpx;
				padding: 20rpx;
			}
		}

		.info-bnt {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 700rpx;
			height: 140rpx;
			background-color: #faf9f9;
			border: solid 1px #eeeeee;
			padding: 0 25rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			box-sizing: content-box;

			.bnt {
				width: 208rpx;
				height: 60rpx;
				background-color: #03004d;
				border-radius: 30rpx;
				line-height: 60rpx;
				text-align: center;
				font-size: 26rpx;
				color: #ffffff;
			}
		}

		.info-bnt1 {
			width: 750rpx;
			height: 160rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			box-sizing: content-box;
		}
	}
</style>